<template>
	<view class="container-show">
	  <view class="header">
	    <view>{{currentSchool.school_name}}</view>
	    <picker @change="bindPickerChange($event)" :range="schools" range-key="school_name">切换</picker>
	  </view>
	  
	  <view class="progress">
	    <view>业务进程</view>
	    <view @click="scheduleTap">{{progress}}</view>
	  </view>
	  <view class="classes">
	    <view class="classes-title">详细数据</view>
	    <view class="classes-item">
	      <view v-for="(item,index) in list"  @click="tap(index)"  :key="index">{{item.name}}</view>
	    </view>
	  </view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				list:[
				  {
					name:'销售',
					id: 0
				  },
				  {
					name:'售后',
					id: 1
				  },
				  {
					name:'发货',
					id: 2
				  },
				  {
					name:'财务',
					id: 3
				  }],
				schools:[{school_name:"a"},{school_name:"b"},{school_name:"c"}],
				currentSchool:{},
				progress: '0/0',
			}
		},
		onLoad() {
			this.changedNaviTitle();
			this.getSchools();
		},
		onShow() {
			// if(this.currentSchool)
			// 	this.getSchools();
		},
		methods:{
			tap (index) {
				const item = this.list[index]
			    // console.log(e.target.dataset.item)
			    var url = ''
			    switch (item.id){
			      case 0: 
			      url = '../sale/statistics/statistics'; break
			      case 1:
			      url = '../refund/statistics/statistics'; break
			      case 2:
			      url = '../logistics/statistics/statistics'; break
			      case 3: 
			      url = '../finance/statistics/statistics'; break
			      
			    }
			    uni.navigateTo({
			      url: url
			    })
			  },
			
			  scheduleTap(e){
			    uni.navigateTo({
			      url: './schedule/schedule',
			    })
			  },
			bindPickerChange(e){
			    let school = this.schools[e.target.value];
				this.currentSchool = school
			    this.sysncCurrentSchool()
			    this.getProgressRatio()
			  },
			 getSchools(){
				this.$api.getSchoolList().then(res => {
					let {data} = res.data
					// console.log(data)
					var school = data.length ? data[0] : {};
					this.schools = data,
					this.currentSchool = school
					this.sysncCurrentSchool()
					this.getProgressRatio()
				}).catch(res => {
				　　// 失败进行的操作
					console.log(res) 
					// uni.switchTab({
					// 	url:"../main/main"
					// })
				})
			  },
			  getProgressRatio () {
				  this.$api.progressRatio({school_id: this.currentSchool.school_id}).then(res => {
						let {data} = res.data
						this.progress = data
				  }).catch(res => {
				  　　// 失败进行的操作
				  })
				 
			  },
			  
			  sysncCurrentSchool(){
				  // TODO 
			      this.$store.commit("SET_SCHOOL",JSON.stringify(this.currentSchool))
			    },
			  
				changedNaviTitle () {
				  const userInfo = this.$store.getters.info;
				  uni.setNavigationBarTitle({
					  title:userInfo.group_title
				  })
				}
			      
		}
	}
	
</script>

<style lang="scss">
	.container-show{
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  justify-content: space-between;
	  box-sizing: border-box;
	  margin-left: 8rpx;
	  margin-right: 8rpx;
	}
	
	.header{
	  display: flex;
	  width: calc(100% - 16rpx);
	  height: 120rpx;
	  background-color: #F5F5F5;
	  border: 1rpx solid #ddd;
	  align-items: center;
	  justify-content: space-between;
	  box-sizing: border-box;
	  padding-left: 20rpx;
	  padding-right: 20rpx;
	}
	
	.progress{
	  width: calc(100% - 16rpx);
	  height: 300rpx;
	  border: 1rpx solid #ddd;
	  box-sizing: border-box;
	  margin-top: 35rpx;
	  padding-left: 20rpx;
	  padding-right: 20rpx;
	}
	
	picker{
	  font-size: 13px;
	}
	
	.progress > view:nth-child(1){
	  display: flex;
	  height: 80rpx;
	  align-items: center;
	  justify-content: center;
	  font-size: 13px;
	}
	
	.progress > view:nth-child(2){
	  display: flex;
	  height: 220rpx;
	  align-items: center;
	  justify-content: center;
	  font-size: 50px;
	  font-weight: bold;
	}
	
	.classes{
	  width: calc(100% - 16rpx);
	  height: 280rpx;
	  box-sizing: border-box;
	  margin-top: 35rpx;
	}
	
	.classes-title{
	  height: 60rpx;
	  font-size: 13px;
	}
	
	.classes-item{
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  height: 220rpx;
	}
	
	.classes-item > view{
	  border: 1rpx solid #ddd;
	  width: 150rpx;
	  height: 220rpx;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  font-size: 21px;
	  font-weight: bold;
	}
</style>
